<template>
	<view>
		<u-popup :show="isVip" :round="10" :closeable="true" mode="center" @close="close">
			<view class="vip f-y-bt">
				<view class="p15 bd1 wei">会员选择</view>
				<view class="f-1 p-10-15 f-y-bt">
					<view class="v_cont">
						<view :class="v_index===index?'is_vitem':''" class="v_item p10 bf5 bs6 mb10 mr15 flex"
							v-for="(item,index) in vipData" :key="index" @click="chooseMember(item,index)">
							<u-avatar :src="item.avatar" size="45"></u-avatar>
							<view class="f-1 ml10">
								<view class="f18 wei6 mb10">{{item.nickname}}
									<text class="f14 c9 pl10 wei5">(ID:{{item.id}})</text>
								</view>
								<view class="f14 c6">手机号：{{item.mobile}}</view>
								<!-- <view class="f14 c6">余额：{{item.account && item.account.balance}}</view> -->
							</view>
						</view>
					</view>
				</view>
			</view>
		</u-popup>
		<addUser ref="addUserRef" @fetchData="fetchData"></addUser>
	</view>
</template>

<script>
	export default {
		components: {
			
		},
		props: {
			
		},
		data() {
			return {
				isVip:false,
				v_index: '',
				phone: '',
				vipData:[],
			}
		},
		methods: {
			close() {
				this.isVip = false
			},
			open(v) {
				if(v) this.vipData = v
				this.isVip = true
			},
			chooseMember(item, index) {
				this.v_index = index
				this.$emit('chooseMember', item)
				this.phone = ''
				this.vipData = []
				this.close()
			},
		}
	}
</script>

<style lang="scss" scoped>
	.vip {
		width: 650rpx;
		height:550rpx;
		overflow: hidden;

		.v_cont {
			overflow-y: scroll;
			height: 410rpx;

			.v_item {
				width: 600rpx;
			}
		}
	}
</style>